<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title>APP</title>
		<link href="css/weui.min.css" rel="stylesheet" />
		<link href="css/jquery-weui.min.css" rel="stylesheet" />
		<link href="css/style.css" rel="stylesheet" />
		<link href="fonts/iconfont.css" rel="stylesheet" />
		<link href="css/flex.css" rel="stylesheet" />
		<script src="js/immersed.js"></script>
	</head>

	<style>
		.main-body {
			background-color: #f4f4f4;
		}
		
		.weui-cell {
			font-size: 15px;
		}
		
		.weui-label {
			width: 100px;
		}
	</style>

	<body>

		<div id="app">
			<form id="form" v-on:submit.prevent>

				<div class="xiaoyi-header header-red" id="header">
					<div class="xiaoyi-header-left"><i class="iconfont icon-back " onclick="wsClose()"></i></div>
					<div class="xiaoyi-header-title">修改密码
					</div>
					<!--<div class="xiaoyi-header-right"><span style="margin: 10px 10px 0 0 ; display: block;" @click="onSubmit">搜索</span></div>-->
				</div>

				<div class="main-body" id="main">

					
					
					<div class="weui-cells weui-cells_form">

						<div class="weui-cell">
							<div class="weui-cell__hd"><label class="weui-label">手机号</label></div>
							<div class="weui-cell__bd">
								<input class="weui-input" type="text" name="phone" id="phone" readonly="readonly" v-model="phone">
							</div>
						</div>
						
						<div class="weui-cell weui-cell_vcode">
					        <div class="weui-cell__hd"><label class="weui-label">验证码</label></div>
					        <div class="weui-cell__bd">
					          <input class="weui-input" type="number" id="verify" placeholder="图片验证码" v-model="verify">
					        </div>
					        <div class="weui-cell__ft">
					          <img class="weui-vcode-img reloadverify" id="verifyImg" src="">
					        </div>
					      </div>

						<div class="weui-cell weui-cell_vcode">
					        <div class="weui-cell__hd">
					          <label class="weui-label">短信</label>
					        </div>
					        <div class="weui-cell__bd">
					          <input class="weui-input" name="sms" type="tel" placeholder="短信验证码" v-model="sms">
					        </div>
					        <div class="weui-cell__ft">
					          <button class="weui-vcode-btn" @click="getSms">获取短信</button>
					        </div>
					    </div>

					</div>
					
					
					<div class="weui-cells weui-cells_form">

						<div class="weui-cell">
							<div class="weui-cell__hd"><label class="weui-label">新密码</label></div>
							<div class="weui-cell__bd">
								<input class="weui-input" type="password" name="password" id="password" placeholder="请输入新密码" v-model="password">
							</div>
						</div>

						<div class="weui-cell">
							<div class="weui-cell__hd"><label class="weui-label">确认新密码</label></div>
							<div class="weui-cell__bd">
								<input class="weui-input" type="password" name="repassword" id="repassword" placeholder="请确认新密码" v-model="repassword">
							</div>
						</div>

					</div>

					
					<div class="weui-btn-area">
						<button type="submit" @click="onSubmit" class="weui-btn weui-btn_primary">提 交</button>
					</div>

				</div>

			</form>
		</div>

		<script src="js/mui.min.js"></script>
		<script src="js/jquery-2.1.4.js"></script>
		<script src="js/jquery-weui.min.js"></script>
		<script src="js/vue.js"></script>
		<script src="js/smarge.js"></script>
		<script src="js/common.js"></script>
		<script type="text/javascript" charset="utf-8">
			mui.init();

			mui.plusReady(function() {
				
				var userinfo = getUserInfo();
				var vm = new Vue({
					el: "#app",
					data: {
						userinfo: userinfo,
						phone:userinfo.phone,
						verify:'',
						sms:'',
						password:'',
						repassword:''
					},
					mounted: function() {
						this.inits()
					},
					methods: {
						inits: function() {
							var vm = this;
							//vm.userinfo = getUserInfo();
						},
						onSubmit: function() {
							var _data = fromToJson("form");
							alertHTML(_data)
							plus.nativeUI.showWaiting()
							Post(SERVER_URL+"&c=User&a=setPassword",_data,function(data){
									if(data.status){
										plus.nativeUI.closeWaiting();
										mui.toast(data.info)
									}else{
										plus.nativeUI.closeWaiting(); 
										mui.alert(data.info)
									}
							})
						},
						getSms : function(){
							var vm = this ;
							Get(SERVER_URL+'&c=Public&a=getSms',{phone:vm.phone,verify:vm.verify},function(data){
								if(data.status){
									mui.toast('短信发送成功')
								}else{
									mui.alert(data.info)
								}
							})
						}
					}
				});
				
				//刷新验证码
				var verifyimg = SERVER_URL+'&c=Public&a=verify'; 
				$("#verifyImg").attr("src",verifyimg);
				$(".reloadverify").on('click', function() {
					if(verifyimg.indexOf('?') > 0) {
						$("#verifyImg").attr("src", verifyimg + '&random=' + Math.random());
					} else {
						$("#verifyImg").attr("src", verifyimg.replace(/\?.*$/, '') + '?' + Math.random());
					}
				});

			});

			
		</script>
	</body>

</html>